<template>
  <div class="review-list">
    <div class="experts-wrap" v-if="expertsTaskList.length">
      <p>专家建议</p>
      <span
        :class="flag ? 'el-icon-arrow-down' : 'el-icon-arrow-right'"
        @click="handleToggle"
      ></span>
    </div>
    <div v-for="m in expertsTaskList" :key="m.id">
      <div class="node-info" v-show="flag">
        <el-row :gutter="20">
          <el-col :span="6">
            <p>审核时间：{{ m.createTime }}</p>
          </el-col>
          <el-col :span="6">
            <p>
              专家：{{ userId == m.createBy ? m.expertsInfo.userName : "匿名" }}
            </p>
          </el-col>
          <el-col :span="6">
            <p v-show="m.resStatus == 1">
              审核状态：
              <span class="color-success">建议通过</span>
            </p>
            <p v-show="m.resStatus == 2">
              审核状态：
              <span class="color-danger">建议修改后通过</span>
            </p>
          </el-col>
          <el-col :span="6">
            <el-button
              size="mini"
              icon="el-icon-download"
              @click="handleDown(m)"
              >下载评审</el-button
            >
          </el-col>
        </el-row>
      </div>
      <div class="node-content experts-content" v-show="flag">
        <p class="node-content-title">专家建议 :</p>
        <div class="content-wrap" v-html="m.content"></div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      expertsTaskList: [],
      flag: false,
      userId: this.$store.getters.userId,
    };
  },
  props: ["data"],
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.expertsTaskList = this.data.filter((v) => v.status == 2);
    },
    handleToggle() {
      this.flag = !this.flag;
    },
    handleDown(v) {
      window.location.href =
        this.baseURL + "/openApi/exportWord/auditDetail?id=" + v.id;
    },
  },
};
</script>
<style scoped lang="scss">
.experts-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
  text-indent: 10px;
  height: 32px;
  line-height: 32px;
  background: #67c23a;
  p {
    display: inline-block;
  }
  button {
    margin-left: 20px;
  }
  span {
    position: absolute;
    right: 10px;
    top: 10px;
    color: #fff;
    cursor: pointer;
  }
}
.node-info {
  height: 60px;
  line-height: 60px;
  // border-top: 1px solid #ddd;
}
.experts-content {
  padding: 10px 20px;
  background: #f1fbec;
}
</style>